<!--
 * @Descripttion:
 * @version:
 * @Author: cxguo
 * @Date: 2020-06-01 09:35:59
 * @LastEditors: cxguo
 * @LastEditTime: 2020-11-06 14:14:00
-->
<template>
  <tree-select
    v-if="options.length > 0"
    v-bind="$attrs"
    :options="options"
    :props="tprops"
    :accordion="true"
    default-expand-all
    @getValue="onGetValue"
  />
</template>

<script>
import TreeSelect from '@/components/TreeSelect'
import { listData } from '@/api/goods/cate'
import XEUtils from 'xe-utils'

export default {
  name: 'GoodsCatTreeSelect',
  components: { TreeSelect },
  props: {
  },
  data() {
    return {
      options: [],
      tprops: {
        value: 'id', // ID字段名
        label: 'name', // 显示名称
        children: 'children' // 子级字段名
      }
    }
  },
  watch: {
  },
  created() {
    this.initData()
  },
  mounted() {
  },
  methods: {
    initData() {
      listData().then(res => {
        if (!res.data.flag) return
        const data = res.data.data
        const treeData = XEUtils.toArrayTree(data, {
          key: 'id',
          parentKey: 'pid'
        })
        const options = treeData[0].children || []
        this.options = options
      })
    },
    onGetValue(val) {
      this.$emit('input', val)
    }
  }
}
</script>

<style scoped>
</style>
